<template>
  <GModal
    :visible="visible"
    okText="提交"
    cancelText="关闭"
    :title="title"
    :maskClosable="false"
    :keyboard="false"
    @cancel="closeModal()"
    @ok="handleSubmit">
    <a-form :form="form"  :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
      <a-form-item label="属性名称">
        <a-input
          v-decorator="['quotedName', { rules: [{ required: true, message: '请填写属性名称' }] }]"
          placeholder="请输入1-12个汉字的属性名称"
        />
      </a-form-item>
      <!-- <a-form-item label="字典值">
        <a-input
          v-decorator="['dictValue', { rules: [{ required: true, message: '请输入字典值' }] }]"
          placeholder="请输入字典值"
        />
      </a-form-item> -->
    </a-form>
  </GModal>
</template>
<script>

export default {
  name: 'PriceSettingForm',
  props: {
    record: {
      type: Object,
      default () {
        return {}
      }
    },
    visible: {
      type: Boolean,
      default: false
    }
  },
  computed: {
    title () {
      return this.record.id ? '修改属性' : '新增属性'
    }
  },
  data () {
    return {
      form: this.$form.createForm(this, { name: 'table_search' })
    }
  },
  watch: {
    visible (value) {
      if (value && this.record.id) {
        this.$nextTick(() => {
          const formItems = this.form.getFieldsValue()
          Object.keys(formItems).forEach(key => {
            formItems[key] = this.record[key]
          })
          this.form.setFieldsValue(formItems)
        })
      }
    }
  },
  mounted () {
  },
  methods: {
    handleSubmit () {
      console.log('this.record handleSubmit', this.record)
      this.form.validateFields((err, values) => {
        if (!err) {
          console.log('values', values)
          const addUrl = '/quoted/property/add'
          const updateUrl = '/quoted/property/update'
          let params = {}
          let url = ''
          console.log('this.record validateFields', this.record)
          if (this.record.id) {
            params = { id: this.record.id, ...values }
            url = updateUrl
          } else {
            params = { ...values }
            url = addUrl
          }
          console.log(this.record)
          this.$post(url, params).then(res => {
            if (res && res.returnCode === 1000) {
              this.$message.success('保存成功！')
              this.closeModal(true)
            }
          })
        }
      })
    },

    closeModal (freshTable) {
      this.form.resetFields()
      this.$emit('cancel', freshTable)
    }
  }
}
</script>
